<template>
<!--  <section v-if="show" class="taifeng-dialog" :style="{ width, height }">-->
<!--    <img class="close" src="/src/assets/images/close.png" @click="toggleDialog">-->
<!--    <iframe id="muIframe" class="taifeng-body" :src="src" frameborder="0"></iframe>-->
<!--  </section>-->
</template>

<script lang="ts" name="Dialog" >
import {inject, ref, watch, computed, onMounted} from "vue";

const show = ref(false)
const src = ref('')
// let data = ref('')
/*
onMounted(() => {
  const provideData = inject('provideData');
  data.value = provideData().columns()
  const columns = computed(() => provideData().columns())
  const data = computed(() => provideData().data())
  console.log("columns", columns)
  console.log("data", data)
})
*/


/*watch(() => data.value,
(newVal) => {
        console.log('监听到的值', newVal)
      },
{ deep: true })*/
const data = inject('dataChildren');
watch(() => data,
    (newVal) => {
      console.log('监听到的值', newVal);
    },
    { deep: true }
);
</script>


<style scoped lang="scss">
.taifeng-dialog {
  width: 90%;
  height: 90%;
  position: absolute;
  z-index: 15;
  left: 5%;
  top: 5%;
  background: url('@/assets/images/center-bk.png') no-repeat center;
  background-size: cover;
  display: flex;
  align-items: center;
  justify-content: center;

  .taifeng-body {
    width: 90%;
    height: 85%;
    position: relative;
    top: 5px;
    color: #ffffff;
  }

  .close {
    width: 44px;
    height: 44px;
    cursor: pointer;
    position: absolute;
    right: 30px;
    top: 20px;
  }
}
</style>
